<ion-header-bar align-title="left" class="bar-dark">
	    <div class="h1 title">微信(16)</div>
	    <div class="buttons">
	        <button class="button no-animation button-icon icon ion-android-search">
	        </button>
	        <button class="button no-animation button-icon icon ion-android-add">
	        </button>
	    </div>
	</ion-header-bar>
<ion-view>
    <ion-content on-swipe-left="onSwipeLeft()" on-swipe-right="onSwipeRight()">
        <ion-list class="rj-list">
            <ion-item class="rj-item">
                <div class="rj-contacts-pic rj-orange-bgc">
                    <i class="ion-person-add"></i>
                </div>
                <h2>新的朋友</h2>
            </ion-item>
            <ion-item class="rj-item">
                 <div class="rj-contacts-pic rj-green-bgc">
                     <i class="ion-person-stalker"></i>
                 </div>
                 <h2>群聊</h2>
             </ion-item>
             <ion-item class="rj-item">
                 <div class="rj-contacts-pic rj-blue-bgc">
                     <i class="ion-ios-pricetag"></i>
                 </div>
                 <h2>标签</h2>
             </ion-item>
             <ion-item class="rj-item">
                  <div class="rj-contacts-pic rj-blue-bgc">
                      <i class="ion-person-add"></i>
                  </div>
                  <h2>公众号</h2>
             </ion-item>
        </ion-list>
        <ion-list>
            <ion-item class="rj-contacts-item">
                <div class="rj-contacts-index-bar">A</div>
                <ion-list class="rj-list">
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                </ion-list>
            </ion-item>
            <ion-item class="rj-contacts-item">
                <div class="rj-contacts-index-bar">B</div>
                <ion-list class="rj-list">
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                </ion-list>
            </ion-item>
            <ion-item class="rj-contacts-item">
                <div class="rj-contacts-index-bar">C</div>
                <ion-list class="rj-list">
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                    <ion-item class="rj-item">
                        <div class="rj-contacts-pic">
                            <img src="img/adam.jpg">
                        </div>
                        <h2>李明</h2>
                    </ion-item>
                </ion-list>
            </ion-item>
        </ion-list>
        </ion-content>
        <div class="rj-contacts-right-bar" rj-position-middle on-drag="contacts_right_bar_swipe($event)">
            <div>&uarr;</div>
            <div>☆</div>
            <div>A</div>
            <div>B</div>
            <div>C</div>
            <div>D</div>
            <div>E</div>
            <div>F</div>
            <div>G</div>
            <div>H</div>
            <div>I</div>
            <div>J</div>
            <div>K</div>
            <div>L</div>
            <div>M</div>
            <div>N</div>
            <div>O</div>
            <div>P</div>
            <div>Q</div>
            <div>R</div>
            <div>S</div>
            <div>T</div>
            <div>U</div>
            <div>V</div>
            <div>W</div>
            <div>X</div>
            <div>Y</div>
            <div>Z</div>
            <div>#</div>
        </div>
        <div class="rj-contacts-middle-bar">
            A
        </div>

</ion-view>
